<template>
  <TableQuery
    :query="tableQuery"
    :loadTableList="loadTableList"
    :clearQuery="clearQuery"
    :queryFormHeaders="queryFormHeaders"
    :removeQueryField="removeQueryField"
  />
</template>

<script lang="ts" setup>
import TableQuery from '@/components/base/table/TableQuery.vue';
import { computed, defineProps, withDefaults } from 'vue';
import { getDict, Option, yesOrNoDict } from '@/api/dict';

// 接收父组件参数
interface Props {// 需要在父组件引入自定义的@/api/uem/useTableList.ts组件，然后将其中的部分属性传过来
  query: Record<string, any>, // 查询表单对象
  loadTableList:() => void, // 重新加载表格
  clearQuery:() => void // 清空查询条件
  removeQueryField:(key: string) => void
}
const props = withDefaults(defineProps<Props>(), {
  query: () => ({}), // 返回空对象
});
// 定义查询表单对象，避免直接使用props导致eslint报错
const tableQuery = computed(() => props.query);
// 定义查询表单的内容
const queryFormHeaders = [ // 查询表单
  {
    prop: 'name',
    label: '课程名',
  },
  {
    prop: 'recommend',
    label: '是否推荐',
    list: yesOrNoDict,
  },
  // {
  //   prop: 'id',
  //   label: 'id',
  // },
];
// 1
</script>
<style scoped>

</style>
